@charset "utf-8";
/*！
 * lib CSS 网页模版库 v1.2 基于bootstrap或ZUI
 * Copyright 2017,XIAOBING TECH 
 * Author:MR. WANGHAO
 */
body{
  font-family: "Helvetica Neue","Microsoft Yahei", "微软雅黑",Helvetica, "Hiragino Sans GB",  Arial,"SimSun", sans-serif;
  color: #666;
}

/*定义全局超连接连*/
a:link,a:visited{color: #666}
a:hover,a:active{color: #999;text-decoration: none}
a:focus{outline: 0;}
/***组件开始components start***/




/*列表组 图文imgage-text-style*/
.xb-list{}
.xb-list ul,
.xb-list li{
  list-style: none;
}
.xb-list > .row{margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0}
.xb-list .list-item{padding-left: 0; padding-right: 0; margin-bottom: 12px;position: relative;}
.xb-list .item-media{position: relative; overflow: hidden;display: block;}
.xb-list .item-media:hover{}
.xb-list .item-media img{margin: 0; width: 100%; max-width: 100%; width: auto/9; height: auto; transition: All 0.4s ease-in-out; -webkit-transition: All 0.4s ease-in-out; -moz-transition: All 0.4s ease-in-out; -o-transition: All 0.4s ease-in-out;}
.xb-list .title,
.xb-list .title a{
  display: block; color: #333333
}
.xb-list .item-layer{width: 100%; height: 100%; color: #fff; position: absolute; left: 0; top: 0; background: rgba(0, 0, 0, 0.6) !important; filter: alpha(opacity=60); background-color: #000000; display: none;}
.xb-list .item-layer .icon{position: absolute; left: 50%; top: 50%; display: block; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.23 ease;}
.xb-list .active .icon{margin-top: -10px; /* animation:animations-hover .5s infinite; -moz-animation:animations-hover .5s infinite; -webkit-animation:animations-hover .5s infinite; -o-animation:animations-hover 5s .infinite; */}
@-webkit-keyframes animations-hover{0%{margin-top: 0; background: red;} 25%{} 50%{margin-top: -10px; background: yellow;} 75%{} 100%{margin-top: 0; background: red;}}
.xb-list .active .item-media img{transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -o-transform: scale(1.05); -ms-transform: scale(1.05);}
.xb-list .br{margin-right: 0!important}

/*列表间距*/
.list-space > .row{margin-left: -5px;padding-left: 0; padding-right: -5px}
.list-space .list-item{padding-left: 5px; padding-right: 5px; margin-bottom: 12px;position: relative;}

.list-space-10 > .row{margin-left: -10px;padding-left: 0; padding-right: -10px}
.list-space-10 .list-item{padding-left: 10px; padding-right: 10px; margin-bottom: 12px;position: relative;}

/*自定义列表*/
.list-product{}
.list-product .list-item{width: 300px;float: left;margin-right: 10px;}
.list-product .item-media{height: 500px;background-color: red}
.list-product .item-media img{height: 100%}
.list-product .title{text-align: center;}
.list-product .time{display: block; text-align: right;}


/*在建工地列表*/
.list-gongdi{}
.list-gongdi .item-media{float: left;width: 310px;height: 228px;}
.list-gongdi .item-media img{width: 100%;height: 100%;}
.list-gongdi .list-item .item-layer{ display: none;width: 100%; height: 100%;text-align: center; position: absolute; top: 0px; left: 0px;background: rgba(0, 0, 0, 0.4) !important;  background: #000;  filter: Alpha(opacity=40);}
.list-gongdi .list-item .item-layer .icon{ border: 1px solid #fff; color: #fff; padding: 10px 30px;margin-left: -45px;margin-top: -18px;}
.list-gongdi .list-item .item-layer .icon:hover{ background: #fff; color: #333;}
.list-gongdi .list-item:hover .item-layer{ display:block; animation-name:topAni7;-webkit-animation:topAni7 .5s linear 0s 1 alternate running none;-moz-animation:topAni7 .5s linear 0s normal alternate;animation:topAni7 .5s linear 0s normal alternate;   }
@-webkit-keyframes topAni7{from{opacity:0; top:228px;} to{opacity:1; top:0px;} }
@-moz-keyframes topAni7{from{opacity:0;  top:228px;} to{opacity:1; top:0px;} }
@keyframes topAni7{from{opacity:0; top:228px;} to{opacity:1; top:0px;} }

.list-gongdi .item-content{float: right;width: 720px;height: 240px;}
.list-gongdi .title{
    display: block;
    width: 340px;
    font-size: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.list-gongdi .btn-order{
    background: #920000;
    color: #fff;
    text-align: center;
    padding: 3px 20px;
    box-shadow: 0 3px 2px #b6b6b6;
    font-size: 14px;
    float: right;
}
.list-gongdi .btn-order:hover{
    background: #ffb400;
}
.list-gongdi .desc{font-size: 16px;line-height: 35px;}
.list-gongdi .desc .desc-01{width: 320px;}
.list-gongdi .desc .desc-02{float: right;padding-top: 25px;}

.step {
    counter-reset: flag;
}
.step li {
    position: relative;
}
.step li a:before {
    content: counter(flag);
    counter-increment: flag;
}
.step li a:after {
    content: "";
}
/**/
/*steparrow*/
.step-arrow{
    margin: 20px 0;
}
.step-arrow li {
    padding-right: 20px;
}
.step-arrow li:last-child {
    padding-right: 0;
}
.step-arrow li:nth-child(n+2) a {
    margin-left: -20px;
    border-radius: 0;
}
.step-arrow li a {
    border-radius: 0;
}
.step-arrow li a:hover {
    background-color: #337AB7;
    color: #FFFFFF;
}
.step-arrow li a:before {
    position: absolute;
    z-index: 2;
    width: 40px;
    height: 40px;
    line-height: 40px;
    top: 0;
    left: 2rem;
    font-weight: bold;
    font-size: 2rem;
    overflow: hidden;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.2) inset;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.2) inset;
  text-shadow: -1px -1px 0 rgba(15,73,168,0.66) ;
}
.step-arrow li:not(:last-child) a:after {
    position: absolute;
    top: -1px;
    right: -20px;
    width: 40px;
    height: 40px;
    transform: scale(0.707) rotate(45deg);
    z-index: 1;
    background: #FFF;
    border-radius: 0 5px 0 50px;
    border-top: 1px solid #FFFFFF;
    border-right: 1px solid #FFFFFF;
    box-sizing: content-box;
}
.step-arrow li a:hover:after,
.step-arrow li.active a:after {
    background-color: #337AB7;
}
/*step-round*/
.step-round {
    margin-top: 40px;
}
.step-round>li>a {
    color: #CCCCCC;
    font-size: 13px;
}
.step-round>li.active>a,
.step-round>li.active>a:focus,
.step-round>li.active>a:hover {
    color: #920000;
    background-color: rgba(0, 0, 0, 0);
}
.step-round li a:before {
    position: absolute;
    z-index: 2;
    top: -2rem;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background-color: #ccc;
    color: #fff;
    line-height: 2rem;
    font-weight: 700;
    /*box-shadow: 0 0 0 5px rgb(204, 204, 204);*/
}
.step-round li a:after {
    position: absolute;
    left: 0;
    right: 0;
    top: -38%;
    background-color: #CCCCCC;
    z-index: 1;
    height: 8px;
}
.step-round li a:hover {
    background-color: rgba(0, 0, 0, 0);
    color: #920000;
}
.step-round li:hover a:before,
.step-round li.active a:before {
    background-color: #920000;
    color: #FFFFFF;
    border-color: #337AB7;
}
.step-round li:hover a:after{

}
.step-round li.active a:after {
    background-color: #920000;
}
.step-round li:first-child a:after {
    left: 30%;
    border-radius: 5px 0 0 5px;
}
.step-round li:last-child a:after {
    right: 30%;
    border-radius: 0 5px 5px 0;
}


/*详情模块*/
.xb-details{display: block;}
.details-heading{position: relative;}
.details-heading ul,
.details-heading li{
    list-style: none;
}
.details-heading .title{}
.details-heading .notes{}
.details-summary{}
.details-body{}
/*编辑器容器*/
.xb-editor{color: #999;line-height: 1.8em;}
.xb-editor img{max-width: 100%; width: auto/9;height: auto;}


/*工地详情*/
.details-building{}
.details-building .btn-order{
    position: absolute;
    right: 20px;
    top: 10px;
    display: block;
    width: 135px;
/*    height: 32px;*/
    line-height: 32px;
    color: #fff;
    background: #920000;
    border-radius: 6px;
    text-align: center;
    font-size: 16px;
    box-shadow: 0 3px 2px #b6b6b6;
    text-shadow:none;
}
.details-building .btn-order:hover{
    background: #ffb400;
}
.details-building .details-summary ul,
.details-building .details-summary li{
    list-style: none
}
.details-building .details-summary li{
    width: 180px;
    float: left;
    line-height: 36px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.details-building .details-summary .thumb{
    float: left;
    width: 300px;
    height: 220px;
    overflow: hidden;
}
.details-building .details-summary .content{
    width: 475px;
    padding: 0 0 0 15px;
    float: left;
}
